<template>
	<view class="goods_list">
		<view class="goods_item" v-for="item in urls" :key="item.id" @click="navigator(item.picUrl)">
			<image :src="item.picUrl" lazy-load="true" show-menu-by-longpress="true" mode="aspectFill"></image>
		</view>
	</view>
</template>

<script>
	export default {
		props: ['urls'],
		data() {

			return {
				baseurl: ' ',
				// urls: [
				// 	'https://www.10wallpaper.com/wallpaper/1280x800/1702/Rem_re_zero_girl-2016_Anime_HD_Wallpaper_1280x800.jpg',
				// 	'https://img1.baidu.com/it/u=882011940,3253546464&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=889',
				// 	'https://cdn.uviewui.com/uview/album/1.jpg',
				// 	'https://cdn.uviewui.com/uview/album/2.jpg',
				// 	'https://cdn.uviewui.com/uview/album/3.jpg',
				// 	'https://cdn.uviewui.com/uview/album/4.jpg',
				// 	'https://cdn.uviewui.com/uview/album/5.jpg',
				// 	'https://cdn.uviewui.com/uview/album/6.jpg',
				// 	'https://cdn.uviewui.com/uview/album/7.jpg',
				// 	'https://cdn.uviewui.com/uview/album/8.jpg',
				// 	'https://cdn.uviewui.com/uview/album/9.jpg',
				// 	'https://cdn.uviewui.com/uview/album/10.jpg',
				// 	'https://cdn.uviewui.com/uview/album/8.jpg',
				// 	'https://cdn.uviewui.com/uview/album/9.jpg',
				// 	'https://cdn.uviewui.com/uview/album/10.jpg',
				// ],
			}
		},
		methods: {
			navigator(current) {
				uni.previewImage({
					current,
					urls: this.urls.map(item => item.picUrl)
				})
			},


		}
	}
</script>

<style lang="scss" scoped>
	.goods_list {
		background: #f0f0f0;
		padding: 0 15rpx;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;

		.goods_item {
			background: #fff;
			width: 360rpx;
			margin: 10rpx 0;
			padding: 15rpx;
			box-sizing: border-box;

			image {
				width: 95%;
				height: 220px;
				display: block;
				margin: auto;
			}

			.price {
				color: $shop-color;
				font-size: 36rpx;
				margin: 20rpx 0 5rpx 0;

				text:nth-child(2) {
					color: #ccc;
					font-size: 28rpx;
					margin-left: 17rpx;
					text-decoration: line-through;
				}
			}

			.name {
				font-size: 28rpx;
				line-height: 50rpx;
				padding-bottom: 15rpx;
				padding-top: 10rpx;
			}
		}
	}
</style>
